<template>
  <div id='app'>
     <el-card>
       <el-button @click="$router.push('/advertSpace/add')">添加广告位</el-button>
       <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="id"
        label="id"
        width="180">
      </el-table-column>
      <el-table-column
        prop="spaceKey"
        label="spaceKey"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        label="创建时间">
        <template slot-scope="scope">
          <span>{{ scope.row.createTime | dateFormat }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="创建时间">
        <template slot-scope="scope">
          <span>{{ scope.row.updateTime | dateFormat }}</span>
        </template>
      </el-table-column>
      <el-table-column
        fixed="right"
        label="操作"
        width="100">
      <template slot-scope="scope">
        <el-button @click="handleClick(scope.row)" type="primary" size="small">编辑</el-button>
      </template>
    </el-table-column>
    </el-table>
     </el-card>
  </div>
</template>

<script>
import { getAllSpaces } from '@/services/advert'

export default {
  components: {},
  data () {
    return {
      tableData: []
    }
  },
  methods: {
    handleClick (row) {
      this.$router.push('/advertSpace/' + row.id + '/edit')
    },
    async loadData () {
      const { data } = await getAllSpaces()
      console.log(data)
      if (data.state === 1) {
        this.tableData = data.content
      }
    }
  },
  created () {
    this.loadData()
  },
  filters: {
    dateFormat (date) {
      console.log(date)
      if (date) {
        return date.replace('T', ' ').replace('.000+0000', '')
      }
      return null
    }
  }
}

</script>
<style scoped>

</style>
